<template>
  <div>
    <el-row>
      <el-input  placeholder="输入表名/字段名/表注释/字段注释" class="padding-top padding-bottom" v-model="keyword" @change="searchTables">
        <el-button slot="append" icon="el-icon-search" @click="searchTables"></el-button>
      </el-input>
    </el-row>
    <el-row>
      <el-table
        :data="tables"
        border
        stripe
        highlight-current-row
        size="mini"
        style="width: 100%"
        @selection-change="handleSelectionChange"
      >
        <el-table-column type="selection" width="55">
        </el-table-column>
        <el-table-column type="index" label="顺序" width="50"></el-table-column>
        <el-table-column prop="tableName" label="表名" sortable></el-table-column>
        <el-table-column prop="comments" label="注释"></el-table-column>
      </el-table>
    </el-row>
  </div>
</template>

<script>
    import apis from '../apis'

    export default {
        name: "TableSearch",
        data(){
            return {
              keyword:'',
              tables:[],
              selectedTables:[]
            }
        },
        methods:{
            searchTables(){
                apis.tablehelp.searchTable(this.connect,this.schema,this.keyword).then(res => {
                    this.tables = res.data;
                });
            },
            handleSelectionChange(selectedTables){
              this.selectedTables = selectedTables;
              this.$emit('selection-change', this.selectedTables)
            }
        },
        props:{
            connect:String,
            schema:String
        },
        mounted() {
            this.searchTables()
        }
    }
</script>

<style scoped>

</style>
